﻿@model KhuyenMaiVang.Areas.Admin.Models.ResUser
@{
    Layout = "~/Views/Shared/_LayoutDetail.cshtml";
    ViewBag.Title = "Profile";
}
<div id="container-normal" class="box-item">
<h2>Thay đổi thông tin cá nhân</h2>

<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
<script type="text/javascript">
    $('#Password').data('val', 'false')
</script>
@using (Html.BeginForm())
{
    @Html.ValidationSummary(false)
    @Html.AntiForgeryToken()
    
        <div class="editor-field">
            @Html.HiddenFor(model => model.ID)
            @Html.HiddenFor(model => model.Username)
            @Html.HiddenFor(model => model.Email)
        </div>
    <table>
        <tr>
            <td>@Html.LabelFor(model => model.Username)</td>
            <td class="myprofile-info">@Html.DisplayTextFor(model => model.Username)</td>
        </tr>
        <tr>
            <td>@Html.LabelFor(model => model.Password)</td>
            <td class="myprofile-info">
                @Html.PasswordFor(model => model.Password)
                @Html.ValidationMessageFor(model => model.Password)
            </td>
        </tr>
        <tr>
            <td>@Html.LabelFor(model => model.PasswordConfirm)</td>
            <td class="myprofile-info">
                @Html.PasswordFor(model => model.PasswordConfirm)
                @Html.ValidationMessageFor(model => model.PasswordConfirm)
            </td>
        </tr>
        <tr>
            <td>@Html.LabelFor(model => model.Email)</td>
            <td class="myprofile-info">
                @Html.DisplayTextFor(model => model.Email)
            </td>
        </tr>
        <tr>
            <td>@Html.LabelFor(model => model.DisplayName)</td>
            <td class="myprofile-info">
                @Html.EditorFor(model => model.DisplayName)
                @Html.ValidationMessageFor(model => model.DisplayName)
            </td>
        </tr>
        <tr>
            <td>@Html.LabelFor(model => model.Avatar)</td>
            <td class="myprofile-info">
                <div class="editor-field">
                    @Html.HiddenFor(model => model.Avatar)
                </div>
                <!-- Ajax upload avatar -->
                <script src="@Url.Content("~/Content/scripts/ajaxupload/fileuploader.js")" type="text/javascript"></script>
                <link href="@Url.Content("~/Content/scripts/ajaxupload/fileuploader.css")" rel="stylesheet" type="text/css" />
                <script type="text/javascript">
                    function createUploader() {
                        var uploader = new qq.FileUploader({
                            element: document.getElementById('file-uploader'),
                            action: '/Admin/Helper/Upload/type/avatar',
                            debug: true,
                            multiple: false,
                            allowedExtensions: ['jpg', 'jpeg', 'png', 'gif'],
                            onComplete: function (file, response) {
                                var fullName = "/content/kmvdata/avatars/" + response;
                                $('#previewAvatar').attr('src', fullName);
                                $('#previewAvatar').height(100);
                                $('input[id=Avatar]').val(fullName);
                            }
                        });
                    }
                    window.onload = createUploader;     
                </script>
                <div id="file-uploader">
            
                </div>
                <img alt="" id="previewAvatar" src="@Html.DisplayFor(model => model.Avatar)" height="100px"/>
            </td>
        </tr>
        <tr>
            <td>@Html.LabelFor(model => model.Phone)</td>
            <td class="myprofile-info">
                @Html.EditorFor(model => model.Phone)
                @Html.ValidationMessageFor(model => model.Phone)
            </td>
        </tr>
    </table>
        <p>
            <input class="button" type="submit" value="Cập nhật" />
        </p>
}
<div>
    @Html.ActionLink("Hủy", "Index")
</div>
</div>